<template>
		<view>
		   <view class="uplist">
		        <view class="itemsaa" @click="qietab(1)" >积分兑换
		             <view class="active" v-if="tabindex == 1"></view>
		        </view>
		        <view class="itemsaa" @click="qietab(2)" >中奖订单
		             <view class="active" v-if="tabindex == 2"></view>
		        </view>
		    </view>
		    <view class="ulitem"  v-for="item in datalist" >
		      <view class="orderno">
		          <view>兑换单号：{{item.order_no}}</view>
		          <view class="copy" @click="copy(item)" >复制</view>
		          <view class="orderstatustxt" v-if="item.order_status > 0">{{item.status_txt}}</view>
		          <view class="orderstatustxt red"  v-if="item.order_status == 0">{{item.status_txt}}</view>
		      </view>
		      <view class="goodsinfo">
		          <view class="goodspic">
		            <image :src="item.goods_pic" mode="widthFix" class="showcover" />
		          </view>
		          <view class="goodsname">
		              <view class="gname">{{item.goods_name}}</view>
		              <view class="jinbi">消耗金额：¥{{item.pay_price}}元</view>
		              <view class="price">下单时间：{{item.add_time}}</view>
		          </view>
		          <view class="count">共1件</view>
		      </view>
		      <view class="orderstatus" v-if="item.username && item.mobile">
		        <view class="refundtime">收货信息：{{item.username}} {{item.mobile}}</view>
		      </view>
		      <view class="orderstatus" style="height: auto;" v-if="item.address">
		        <view class="refundtime">收货地址：{{item.address}}</view>
		      </view>      
		      <view class="cancelorder" v-if="item.order_status == 0 && tabindex == 1"  
		      @click="cancel_order(item)"  >
		        <view class="cancelbtn" >取消订单</view>
		      </view>
		
		      <view class="cancelorder" v-if="item.order_status == 0 && tabindex == 2"  
		        @click="gopay(item)"  >
		        <view class="cancelbtn" >支付订单</view>
		      </view>
		      
		      <view class="orderstatus" v-if="item.order_status == 4">
		        <view class="refundtime" v-if="item.order_status == 4">退款时间：{{item.refund_time}}</view>
		      </view>
		
		      <view class="orderstatus" v-if="item.status == 1">
		        <view class="refundtime" v-if="item.status == 1" >物流信息：{{item.courier_code}} {{item.logistics_company}} 
		          <view @click="copy(item)"  class="copy2">复制</view>
		        </view>
		      </view>
			  
			  
		    </view>
		</view>
</template>

<script>
	export default {
		data() {
			return {
				tabindex:1,
				page:1,
				datalist:[]
				
			}
		},
		onShow() {
			this.getdata()
		},
		methods: {
			qietab(id){
				  this.tabindex=id
				  this.datalist=[];
				  this.page=1;
				  if(id == 1){
					this.getdata();
				  }else{
					 this.getdata2();
				  }
			 },
			 getdata(){
				 var that=this
				 var user_id=uni.getStorageSync('user_id')
				 var page=this.page
				 var page_size=this.page_size
				 var d={};
				 d.user_id=user_id
				 d.page=page
				 d.page_size=page_size
				 d.openid=uni.getStorageSync('openid')
				 var that=this
				 this.request('/api/integral_shop_front/get_user_exchange_log', d,"post").then(ret => {
					 if(ret.info.data.length > 0){
						that.datalist=that.datalist.concat(ret.info.data)
						that.page++ 
					 }
				 })
			 },
			 getdata2(){
				 var that=this
				 var user_id=uni.getStorageSync('user_id')
				 var page=this.page
				 var page_size=this.page_size
				 var d={};
				 d.user_id=user_id
				 d.page=page
				 d.page_size=page_size
				 d.openid=uni.getStorageSync('openid')
				 var that=this
				 this.request('/api/integral_shop_front/get_user_exchange_log3', d,"post").then(ret => {
					 if(ret.info.data.length > 0){
						that.datalist=that.datalist.concat(ret.info.data)
						that.page++ 
					 }
				 })
			 },
			 //取消订单
			 cancel_order(item){
			         var that = this;
			         uni.showModal({
			           title: '取消订单',
			           content: '是否确认取消订单？',
			           complete: (res) => {
			             if (res.confirm) {
			                 var d={}
			                 var id=item.id;
			                 d.record_id=id
							 var that=this
							 this.request('/api/integral_shop_front/refund_user_integral', d,"post").then(ret => {
								 if(ret.info.code == 1){
								     uni.showToast({
								       title: '取消订单成功',
								       icon:"none"
								     })
									 that.page=1
								     that.reloadgetdata()
								 }
							 })
			             }
			           }
			         })
			        
			  },
			 gopay(e){
				 var that=this
				 var user_id=uni.getStorageSync('user_id')
				 var id=e.id;
				 var order_status=e.order_status;
				 if(order_status == 0){
					 var d={};
					 d.log_id=id
					 d.user_id=user_id
					 d.openid=uni.getStorageSync('openid')
					 that.request('/api/code/get_wxpay_json3', d,"post").then(ret => {
						 var json = ret.info.data
						 uni.requestPayment({
						   timeStamp: json.timeStamp,
						   nonceStr: json.nonceStr,
						   package: json.package,
						   signType:json.signType,
						   paySign: json.paySign,
						   success (res) { 
							   uni.showToast({ title: '支付成功', })
							   that.getdata();
						   }
						 }) 
					 })
				 }
			 },
			 copy(item){
				var code = item.courier_code;
				uni.setClipboardData({
					data: code,
					success: function (res) {
						uni.showToast({ title: '复制成功',});
					},
					fail:function(res){
						uni.showToast({ title: '复制失败',icon:"none"});
					}
				 })
			},
		}
	}
</script>

<style>
page{
  background-color: #eee;
}
.ulitem{
  background-color: #fff;
  border-radius: 4px;
  width: calc(100% - 20px);
  margin: 0 auto;
  margin-bottom: 30px;
  padding-bottom: 8px;
}
.red{
  color: red !important;
}
.cancelorder{
   height: 40px;
   line-height: 40px;
   text-align: center;
   background-color: #9a9a9a;
   color: #fff;
   width: calc(100% - 20px);
   margin: 10px auto;
   border-radius: 4px;
}
.copy2{
  color: #00BFBF;
  padding-left: 8px;
}
.orderno{
  display: flex;
  height: 40px;
  line-height: 40px;
  color: #999;
  font-size: 14px;
  border-bottom: 1px solid #eee;
  padding-left: 10px;
}
.copy{
  color: #00BFBF;
  padding-left: 8px;
}
.orderstatustxt{
  color: #00BFBF;
  text-align: right;
  position: absolute;
  right: 18px;
}
.ulitem:nth-child(1){margin-top: 25px;}
.goodsinfo{
  display: flex;
  border-bottom: 1px solid #eee;
}
.goodspic{
  width: 80px;
  height: 80px;
  border: 1px solid #eee;
  margin: 15px;
}
.goodsname{
  padding-top: 15px;
  font-size: 14px;
  width: calc(100% - 105px);
}
.showcover{
  width: 80px;
}
.uplist{
  height: 45px;
  line-height: 45px;
  display:flex;
  background-color: #fff;
  margin-bottom: 10px;
}
.active{
  background-color: #00BFBF;
  height: 3px;
  width: 30px;
  position:absolute;
  left: 42%;
  top: 43px;
}
.itemsaa{
  width: 50%;
  text-align: center;
  position:relative;
}
.count{
  padding-top: 15px;
  color: rgb(138, 131, 131);
  text-align: right;
  position: absolute;
  right: 18px;
  font-size: 12px;
}
.refundtime{
  padding-left: 10px;
  display:flex;
}
.jinbi{
  font-size: 12px;
  color: #666;
  padding: 4px 0px;
}
.price{
  font-size: 12px;
  color: #666;
}
.gname{
  width: calc(100% - 50px);
  overflow: hidden;
  height: 36px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.orderstatus{
  display: flex;
  height: 24px;
  line-height: 24px;
  font-size: 14px;
  padding-left: 10px;
}
</style>
